<div class="section-block">
  <div class="container">
    <form (ngSubmit)="search()" class="form-horizontal">

      <div class="form-group row">
        <div class="col-sm-5">
          <label for="serialno" class="col-sm-5 control-label">证书编号</label>
          <div class="col-sm-7">
            <input type="text" id="serialno" name="serialno" class="form-control"
                   [(ngModel)]="certSearchForm.serialno">
          </div>
        </div>
        <div class="col-sm-5">
          <label for="type" class="col-sm-5 control-label">证书类型</label>
          <div class="col-sm-7 ">
            <select [(ngModel)]="certSearchForm.type" name="type" type="text" class="form-control">
              <option value="" selected>全部</option>
              <option value="质量员">质量员</option>
              <option value="施工员">施工员</option>
            </select>
          </div>
        </div>
      </div>

      <div class="form-group row">
        <div class="col-sm-5">
          <label for="name" class="col-sm-5 control-label">姓&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名</label>
          <div class="col-sm-7">
            <input class="form-control" name="name" type="text" [(ngModel)]="certSearchForm.name">
          </div>
        </div>

        <div class="col-sm-5">
          <label for="companyname" class="col-sm-5 control-label">企业名称</label>
          <div class="col-sm-7">
            <input class="form-control" name="companyname" type="text"
                   [(ngModel)]="certSearchForm.companyname">
          </div>
        </div>

        <div class="col-sm-2" style="text-align: right">
          <button type="submit" class="btn btn-primary pull-left">
            <i class="fa fa-search" aria-hidden="true"></i>查询
          </button>
        </div>
      </div>

    </form>

  </div>
</div>

<div class="section-block">
  <div class="section btn-section btn-toolbar">
    <a role="button" class="btn btn-primary btn-review" [ngClass]="{'disabled': disableViewBtn}"
       (click)="toggleView()">查看详情</a>
    <span *ngIf="_errorMsg">{{_errorMsg}}</span>
    <span *ngIf="errorShow">网络异常，请重新登录</span>
  </div>
  <data-tables [config]="dataTableConfig" [searchParams]="certSearchForm"
               (onSelect)="tableRowSelect($event)"  (onError)="handleError($event)"></data-tables>
</div>

<div bsModal #applyModal="bs-modal" class="modal fade" tabindex="-1" role="dialog"
     aria-labelledby="applyModalLabel" aria-hidden="true" (onHide)="onHideModal()">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <button class="close" (click)="applyModal.hide()" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
        <h4 class="modal-title">详情</h4>
      </div>

      <div class="modal-body">
        <div class="auth-block">
          <div class="row">
            <div class="col-xs-8">
              <form id="applyForm" class="form-horizontal">
                <div class="form-group row"><label class="col-sm-4 form-control-label">人员姓名</label>
                  <div class="col-sm-8"><input type="text" class="form-control" id="name"
                                               [value]="selectedData.certificate.name" readonly>
                  </div>
                </div>

                <div class="form-group row"><label class="col-sm-4 form-control-label">证书类型</label>
                  <div class="col-sm-8"><input type="text" class="form-control" id="type"
                                               [value]="selectedData.certificate.type" readonly>
                  </div>
                </div>
                <div class="form-group row"><label class="col-sm-4 form-control-label">证书编号</label>
                  <div class="col-sm-8"><input type="text" class="form-control" id="serialno"
                                               [value]="selectedData.certificate.serialno" readonly>
                  </div>
                </div>
                <div class="form-group row"><label class="col-sm-4 form-control-label">出生日期</label>
                  <div class="col-sm-8"><input type="text" class="form-control" id="birthday"
                                               [value]="selectedData.certificate.birthday" readonly>
                  </div>
                </div>
                <div class="form-group row"><label class="col-sm-4 form-control-label">企业名称</label>
                  <div class="col-sm-8"><input type="text" class="form-control" id="companyname"
                                               [value]="selectedData.certificate.companyname" readonly>
                  </div>
                </div>
                <div class="form-group row"><label class="col-sm-4 form-control-label">发证时间</label>
                  <div class="col-sm-8"><input type="text" class="form-control" id="issuedate"
                                               [value]="selectedData.certificate.issuedate" readonly>
                  </div>
                </div>
                <div class="form-group row"><label class="col-sm-4 form-control-label">证书状态</label>
                  <div class="col-sm-8"><input type="text" class="form-control" id="available"
                                               [value]="selectedData.certificate.available" readonly>
                  </div>
                </div>

                <div class="form-group row"><label class="col-sm-4 form-control-label">有效时间</label>
                  <div class="col-sm-8"><input type="text" class="form-control" id="availabletime"
                                               [value]="selectedData.certificate.availabletime" readonly>
                  </div>
                </div>
              </form>
            </div>
            <div class="col-xs-4">
              <div class="row">
                <div class="col-sm-10" *ngIf="selectedData.files">
                  <img src="{{selectedData.files.path}}" id="pic">
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <button class="btn btn-default" (click)="applyModal.hide()">关闭</button>
      </div>
    </div>
  </div>
</div>
